<template>
  <div>
   <!--添加公告栏-->
   <!-- 此处box会显示一个小白快-->
    <div class="box">
        🔔 {{billborad.content}}
    </div>
    <div class="columns">
      <div class="column  is-three-quarters">
          <!--3、使用组件-->
          <TopicList></TopicList>
      </div>
      <div class="column">
          <CardBar></CardBar>
      </div>
    </div>
  </div>
</template>

<script>

import {getBillboard} from "@/api/billboard";
//侧边栏
import CardBar from "@/views/card/CardBar";
//帖子相关
import TopicList from "@/views/post/TopicList"

export default {
    name: 'Home',
    //2、components中加入
    components: {
      CardBar,TopicList
    },
    data() {
        return {
            billborad: {
              content: ''
          }
        }
    },
    //在页面开始加载的时候
    created(){
        //请求后台方法
        this.fetchBillborad()
    },
    methods: {
    //定义异步方法
        async fetchBillborad(){
            //接收到服务端返回来的value
            getBillboard().then((value) => {
                const { data } = value
                this.billborad = data;
            })
        }
    }
}
</script>
